import { Component, Vue, Prop } from 'vue-property-decorator'
import styles from './style.less'

/**
 *table为空时显示内容
 *
 * @export
 * @class TableEmpty
 * @extends {Vue}
 */
@Component<TableEmpty>({
  props: {},
  computed: {},
  methods: {},
  watch: {},
})
export default class TableEmpty extends Vue {
  // 图片地址
  @Prop({ type: String, default: '' })
  private url!: string
  @Prop({ type: String, default: '暂无数据' }) private msg!: string
  render() {
    return (
      <div
        class={styles.tableEmpty}
        style={{
          background: `url(${this.url || this.getImage}) center 86px no-repeat`,
        }}
      >
        <p class={styles.content}>{this.msg}</p>
        <p class={styles.opts}>{this.$slots.default}</p>
      </div>
    )
  }

  get getImage() {
    // 默认图片
    return require('@/assets/data-empty.svg')
  }
  created() {}
  mounted() {}
  beforeDestroy() {}
}
